<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <script>
        /*
            作用域: 变量能够作用的区域合集
            
            //3 块级作用域 
        */ 

        //1 全局作用域
        // var greeting = 'Hello World!';
        // function greet() {
        // console.log(greeting);
        // }
        // 打印 'Hello World!'
        // greet();

        //2 函数作用域

        function greet() {
        var greeting = 'Hello World!';
        console.log(greeting);
        }
        // 打印 'Hello World!'
        greet();
        // 报错： Uncaught ReferenceError: greeting is not defined
        // console.log(greeting);

        //3 块级作用域-在⼤括号中使⽤ let 和 const 声明的变量存在于块级作⽤域中。在⼤括号之外不能访问这些变量
        {
            let greeting2 = 'Hello World!';
            var lang = 'English';
            console.log(greeting2); 
        }
        // console.log(greeting2); // 报错：
        console.log(lang); 

        // 4 词法作用域--静态作用域,变量被创建时就确定好了，⽽⾮执⾏阶段确定的
        var a = 2;
        function foo(){
            console.log(a) // 2
        }
        function bar(){
        var a = 3;
            foo();
        }
        bar()

        // 作用域链--当使用一个变量的时候，首先js会尝试在当前作用域下找这个变量，如果没有找到就再到它的上层作用域找，以此类推直到找到这个变量
        // 如果没有找到就 隐式声明该变量或者报错

    </script>
</body>
</html>